<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"> 
	<title>Bootstrap 轮播图</title>
<!-- 	<link href="lib/lib/css/bootstrap.min.css" rel="stylesheet">
	<script src="lib/jquery/jquery-1.11.0.min.js"></script>
	<script src="lib/lib/js/bootstrap.min.js"></script> -->

<script src="lib/jquery/jquery-1.11.0.min.js"></script>
<script src="lib/lib/js/bootstrap.min.js"></script>
<link href="lib/lib/css/bootstrap.min.css" rel="stylesheet">

<style type="text/css">

	div{
		width: 800px;
		height: 400px;
		border: 1px solid #000;
		margin:20px auto;
		background: no-repeat center center;
		position: relative;
		background-size: cover;
		/*contain  在区域内，内容完全显示*/
		background-size: contain;
	}

	.zhongxin{
	background-color: red;
	border-radius: 100%;
	width: 100px;
	height: 100px;
	position: absolute;
	left: 350px;
	top: 150px;
	}


</style>
</head>
<body>

<div style="background-image: url(images/banner1_2000_400.jpg);">
	<p class="zhongxin"></p>


</div>












<!-- <div class="carousel slide" id="lunbo">

	<ol class="carousel-indicators">
		<li data-target="#lunbo" data-slide-to="0" class="active"> </li>
		<li data-target="#lunbo" data-slide-to="1"></li>
		<li data-target="#lunbo" data-slide-to="2"></li>
	</ol>


	<div class="carousel-inner">
		<div class="item active"><img src="images/2.jpg" alt="First slide"></div>
		<div class="item"><img src="images/2.jpg" alt="First slide"></div>
		<div class="item"><img src="images/2.jpg" alt="First slide"></div>
	</div>

	<a class="left carousel-control" href="#lunbo" role="button" data-slide="prev">
		<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
		<span class="sr-only">Previous</span>
	</a>


	<a href="#lunbo" class="right carousel-control" role="button" data-slide="next">
		<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
		<span class="sr-only">Next</span>
	</a>


</div> -->






<br><br>
<hr><hr>
<br><br>

<script type="text/javascript">
	
	$(function(){
		
	})


</script>

</body>
</html>